<main>
  <div class="panelgroup">
    <div class="panel-hd">
      <h3>基本信息</h3>
    </div>
    <div class="panel-bd">
      <ul>
        <li>
          <div class="key">
            <span>采购单号</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.purchaseNumber}}</span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>甲方</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.firstPartyName}}</span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>申请人</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.applicant}}</span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>审核人</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.reviewer ? detailsData?.purchase.reviewer : '-'}}</span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>状态</span>
          </div>
          <div class="val" [class]="'font-' + detailsData?.purchase.state">
            <span>
              {{detailsData?.purchase.stateText}}
              <i nz-icon nz-tooltip nzType="exclamation-circle" nzTheme="outline"
                nzTooltipTitle="{{detailsData?.purchase.auditDesc}}" nzTooltipPlacement="right"
                *ngIf="detailsData?.purchase.state == 3"></i>

            </span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>乙方</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.partyBName}}</span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>申请时间</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.createTime}}</span>
          </div>
        </li>
        <li>
          <div class="key">
            <span>审核时间</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.auditTime ? detailsData?.purchase.auditTime : '-'}}</span>
          </div>
        </li>
      </ul>
      <ul>
        <li class="len">
          <div class="key">
            <span>备注</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.remark ? detailsData?.purchase.remark : '-'}}</span>
          </div>
        </li>
      </ul>
      <ul *ngIf="detailsData?.purchase.closeRemark">
        <li class="len">
          <div class="key">
            <span>关闭原因</span>
          </div>
          <div class="val">
            <span>{{detailsData?.purchase.closeRemark}}</span>
          </div>
        </li>
      </ul>
    </div>
    <br>
    <div class="panel-hd">
      <h3>采购信息</h3>
    </div>
    <div class="panel-bd">
      <nz-table #colSpanTable nzBordered [nzShowPagination]="false" [nzData]="detailsData?.list">
        <thead>
          <tr>
            <th nzAlign="center">序号</th>
            <th nzAlign="center">商品编号</th>
            <th nzAlign="center">商品名称</th>
            <th nzAlign="center">商品规格</th>
            <th nzAlign="center">69码</th>
            <th nzAlign="center">标准采购价(含税)</th>
            <th nzAlign="center">计划数量</th>
            <th nzAlign="center">本次采购数量</th>
            <th nzAlign="center">冻结数量</th>
            <th nzAlign="center">采购单价</th>
            <!-- <th nzAlign="center">采购价涨幅</th> -->
            <th nzAlign="center">金额小计</th>
            <th nzAlign="center">已入库数量</th>
            <th nzAlign="center">状态</th>
            <th nzAlign="center">操作</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let item of detailsData?.list; let i=index">
            <!-- 序号 -->
            <td nzAlign="center">{{ i+ 1}}</td>
            <!-- 商品编号 -->
            <td nzAlign="center">{{ item.whGoodsId }}</td>
            <!-- 商品名称 -->
            <td nzAlign="left">{{ item.name }}</td>
            <!-- 商品规格 -->
            <td nzAlign="center">{{ item.attr }}</td>
            <!-- 69码 -->
            <td nzAlign="center">{{ item.code }}</td>
            <!-- 标准采购价(含税) -->
            <td nzAlign="center">
              {{ item.standardCostPrice ? '￥' +  (item.standardCostPrice | number : '0.4-4' ) : '-'}}
            </td>
            <!-- 计划数量s -->
            <td nzAlign="center">{{ item.planNumber }}</td>
            <!-- 本次采购数量 -->
            <td nzAlign="center">{{ item.purchaseNumber }}</td>
            <!-- 冻结数量 -->
            <td nzAlign="center">{{item.frozenNumber ? item.frozenNumber : '-'}}</td>
            <!-- 采购单价 -->
            <td nzAlign="center">{{ '￥' + ( item.purchasePrice | number : '0.4-4' )}}</td>
            <!-- 采购价涨幅 -->
            <!-- <td nzAlign="center">{{item.priceIncrease}}</td> -->
            <!-- 金额小计 -->
            <td nzAlign="center">{{ '￥' + ( item.purchaseNumber * item.purchasePrice | number : '0.4-4' ) }}</td>
            <!-- 已入库数量 -->
            <td nzAlign="center">{{ item.stockNumber }}</td>
            <!-- 状态 -->
            <td nzAlign="center">
              {{ item.stateText }}
              <i nz-icon nz-tooltip nzType="exclamation-circle" nzTheme="outline" nzTooltipTitle="{{item.closeRemark}}"
                nzTooltipPlacement="right" *ngIf="item.closeRemark"></i>
            </td>
            <!-- 操作 -->
            <td nzAlign="center">
              <button nz-button nz-button-tdlink nzType="link"
                [disabled]="![ 2, 4].includes(detailsData?.purchase.state)"
                (click)="showCloseModal(0,item.id)">手动关闭</button>
            </td>
          </tr>
        </tbody>
      </nz-table>
    </div>
  </div>

  <div class="submit-box">
    <nz-divider></nz-divider>
    <div class="bt-box">
      <button nz-button nzType="primary" [routerLink]="['/stock/purchaseOrderAdd', id]"
        *ngIf="detailsData?.purchase.state == 0 || detailsData?.purchase.state == 3">编辑</button>
      <button nz-button nzType="primary" *ngIf="detailsData?.purchase.state == 1" (click)="showModal()">审核</button>
      <button nz-button nzType="dashed" (click)="showCloseModal(1)"
        *ngIf="detailsData?.purchase.state == 2 || detailsData?.purchase.state == 4">手动关闭</button>
      <app-bt-group [btType]="'default'" [btText]="'返回'"></app-bt-group>
    </div>
  </div>
</main>

<nz-modal [(nzVisible)]="isVisible" nzTitle="审核" (nzOnCancel)="handleCancel()" [nzFooter]="null">
  <ng-container *nzModalContent>
    <nz-form-item>
      <nz-form-label [nzSpan]="4">审核意见</nz-form-label>
      <nz-form-control [nzSpan]="14">
        <textarea rows="6" nz-input [(ngModel)]="detailsData?.purchase.auditDesc"></textarea>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-control [nzSpan]="12" [nzOffset]="4">
        <button nz-button nzType="primary" (click)="save(2)">通过</button>
        <button nz-button nzType="primary" (click)="save(3)">不通过</button>
        <button nz-button nzType="default" (click)="handleCancel()">取消</button>
      </nz-form-control>
    </nz-form-item>
  </ng-container>
</nz-modal>

<nz-modal [(nzVisible)]="closeVisible" nzTitle="手动关闭" (nzOnCancel)="handleCancel()" [nzFooter]="null">
  <ng-container *nzModalContent>
    <nz-form-item>
      <nz-form-label [nzSpan]="4" nzRequired>关闭原因</nz-form-label>
      <nz-form-control [nzSpan]="14">
        <textarea rows="6" nz-input [(ngModel)]="closeParams.content"></textarea>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-control [nzSpan]="12" [nzOffset]="4">
        <button nz-button nzType="primary" (click)="closeFun()">关闭</button>
        <button nz-button nzType="primary" (click)="handleCancel()">取消</button>
      </nz-form-control>
    </nz-form-item>
  </ng-container>
</nz-modal>